function createTextNode(text) {
    return {
        type: 'TEXT_ELEMENT',
        props: {
            nodeValue: text,
            children: [],
        },
    };
}

function createElement(type, props, ...children) {
    return {
        type,
        props: {
            ...props,
            children: children.map(child => (typeof child === 'object' ? child : createTextNode(child))),
        },
    };
}

function render(element, container) {
    // 根据 element 的 type 来创建 dom
    const dom = element.type === 'TEXT_ELEMENT' ? document.createTextNode('') : document.createElement(element.type);
    // 设置属性
    Object.keys(element.props).forEach(name => {
        // 除了 children 属性，其他属性都直接设置到 dom 上
        if (name !== 'children') {
            dom[name] = element.props[name];
        }
    });
    // 递归渲染子节点
    element.props.children.forEach(child => render(child, dom));
    // 将 dom 添加到 container
    container.appendChild(dom);
}
const React = {
    createElement,
    render,
};
export default React;
